<template>
  <t-dialog :visible.sync="visible"
  :header="`调查单位详情-${header}`"
  :confirmBtn="null"
  :cancelBtn="null"
  :onClose="closeDialog"
  :closeOnOverlayClick="false"
  placement="center"
  width="60%">
      <div style="height: 65vh; width: 98%">
          <t-form ref="form" :data="formData" :colon="true">
          <t-row :gutter="[14,25]">
            <t-col :span="6">
                  <t-form-item labelWidth="220px" label="统一社会信用代码" name="code">
                      {{ formData.code }}
                  </t-form-item>
                  <t-form-item labelWidth="220px" label="单位详细名称" name="name">
                      {{ formData.name }}
                  </t-form-item>
                  <t-form-item labelWidth="220px" label="所属国民经济行业分类门类代码" name="nationalEconomyCode">
                    {{ formData.nationalEconomyCode | filterByDict(dict.type.kpzh_national_economy_code) }}
                  </t-form-item>
                  <!-- <t-form-item labelWidth="220px" label="机构属性名称" name="orgStatsName">
                      {{ formData.orgStatsName }}
                  </t-form-item> -->
                  <t-form-item labelWidth="220px" label="单位所在地及区划" name="locationId">
                    {{ formData.locationId }}
                  </t-form-item>
                  <t-form-item labelWidth="220px" label="单位经费来源情况" name="sourceFunds">
                    {{ formData.sourceFunds | filterByDict(dict.type.kpzh_source_funds) }}
                  </t-form-item>
                  <t-form-item labelWidth="220px" label="填表人" name="preparer">
                      {{ formData.preparer }}
                  </t-form-item>
                  <t-form-item labelWidth="220px" label="固定电话" name="phone">
                      {{ formData.phone }}
                  </t-form-item>
                  <t-form-item labelWidth="220px" label="移动电话" name="mobilePhone">
                      {{ formData.mobilePhone }}
                  </t-form-item>
                  <t-form-item labelWidth="220px" label="传真号" name="fax">
                      {{ formData.fax }}
                  </t-form-item>
              </t-col>
              <t-col :span="6">
                  <t-form-item labelWidth="220px" label="组织机构代码" name="orgCode">
                      {{ formData.orgCode }}
                  </t-form-item>
                  <t-form-item labelWidth="220px" label="机构主管部门类别代码" name="manageOrgCode">
                    {{ formData.manageOrgCode | filterByDict(dict.type.kpzh_manage_org_code) }}
                  </t-form-item>
                  <t-form-item labelWidth="220px" label="机构属性" name="orgStats">
                    {{ formData.orgStats }}
                  </t-form-item>
                  <t-form-item labelWidth="220px" label="单位级别" name="unitLevel">
                    {{ formData.unitLevel }}
                  </t-form-item>
                  <t-form-item labelWidth="220px" label="区域代码" name="addressCode">
                      {{ formData.addressCode }}
                  </t-form-item>
                  <t-form-item labelWidth="220px" label="科普站负责人" name="legalRepresentative">
                      {{ formData.legalRepresentative }}
                  </t-form-item>
                  <t-form-item labelWidth="220px" label="长途区号" name="tollAreaCode">
                      {{ formData.tollAreaCode }}
                  </t-form-item>
                  <t-form-item labelWidth="220px" label="邮政编码" name="postCode">
                      {{ formData.postCode }}
                  </t-form-item>
              </t-col>
          </t-row>
      </t-form>
      </div>
  </t-dialog>
</template>

<script>
// import TinyMceEditor from "@/components/TinyMceEditor/index.vue";

export default {
  name: "unit-add-edit",
  dicts: ['kpzh_manage_org_code', 'kpzh_national_economy_code', 'kpzh_unit_level', 'kpzh_source_funds'],
  components: {
    // TinyMceEditor
  },
  props:{
    objId: {
      type: [String, Number],
      default: '',
    },
    header: {
      type: String,
      default: '新增'
    },
    row: {
      type: Object,
      default: () => ({})
    },
    isUpdate: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      visible: true,
      formData: {
        name: '',
        orgStats: ''
      },
      locationOptions: [],
      menuOptions: [],
      confirmLoading: false,
      treeProps: {
        keys: {
          value: 'id'
        },
      }
    }
  },
  created() {
    Object.assign(this.formData, this.row)
    this.getTreeSelect();
    this.getLocation();
  },
  methods: {
    closeDialog() {
      this.$emit("update:visible", false);
    },
    treeChange(value, context) {
      this.formData.orgStats = context.data?.id
    },
    treeClear() {
      this.formData.orgStats = null
    },
    submit() {
      if (this.formData.orgStats === null) {
        return 
      }
      this.confirmLoading = true
      const promise = this.isUpdate ? this.$api.kpzh.unit.update(this.formData) : this.$api.kpzh.unit.add(this.formData)
      promise.then(res => {
        this.confirmLoading = false
        this.visible = false
        this.$emit("update:visible", false);
        this.$emit("reload")
      }).catch((e) => {
        this.$message.error(e.toString());
        this.confirmLoading = false
      });
    },
    getTreeSelect() {
      this.$api.kpzh.unit.treeSelect().then(response => {
        this.menuOptions = response.data;
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    getLocation(){
      return this.$api.system.location.treeselect().then(response => {
        this.locationOptions = response.data;
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    }
  },
}

</script>

<style scoped>

</style>